<%--
  Created by IntelliJ IDEA.
  User: vi
  Date: 2019/9/17
  Time: 11:50
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html; charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ include file="../include/admin/adminHeader.jsp" %>
<%@ include file="../include/admin/adminNavigator.jsp"%>

<script>
    <!-- 防止空提交 -->
    $(function(){
       $(".addFormSingle").submit(function(){
           if(!checkEmpty("filePathSingle","单个图片"))
               return false;
           return true;
       });
        $(".addFormDetail").submit(function(){
            if(!checkEmpty("filePathDetail","详情图片"))
                return false;
            return true;
        });
    });
</script>

<title>产品图片管理</title>

<div class="workingArea">
    <ol class="breadcrumb">
        <li><a href="admin_category_list">所有分类</a></li>
        <li><a href="admin_product_list?cid=${product.cid}">${product.category.name}</a></li>
        <li class="active">${product.name}</li>
        <li class="active">产品图片管理</li>
    </ol>

    <!-- 添加图片 -->
    <table class="addPictureTable" align="center">
        <tr>
            <td class="addPictureTableTD">
                <div>
                    <div class="panel panel-warning addPictureDiv" >
                        <div class="panel-heading">新增产品<b class="text-primary"> 单个 </b>图片</div>
                        <div class="panel-body">
                            <form method="post" class="addFormSingle" action="admin_productImage_add" enctype="multipart/form-data">
                                <table class="addTable">
                                    <tr>
                                       <td>请选择本地图片 尺寸400x400为佳</td>
                                    </tr>
                                    <tr>
                                        <td align="center"><input id="filePathSingle" type="file" name="image"></td>
                                    </tr>
                                    <tr class="submitTR">
                                        <td align="center">
                                            <input type="hidden" name="type" value="type_single" />
                                            <input type="hidden" name="pid" value="${product.id}" />
                                            <button type="submit" class="btn btn-success">提交</button>
                                        </td>
                                    </tr>
                                </table>
                            </form>
                        </div>
                    </div>
                        <!-- 数据展示   -->
                        <table class="table table-striped table-bordered table-hover table-condensed">
                            <thead>
                                <tr class="success">
                                    <th>产品ID</th>
                                    <th>产品单个缩略图</th>
                                    <th>删除</th>
                                </tr>
                            </thead>
                            <tbody>
                                <c:forEach items="${pisSingle}" var="pi">
                                    <tr>
                                        <td>${pi.id}</td>
                                        <td>
                                            <a title="点击查看原图" href="img/productSingle/${pi.id}.jpg">
                                                <img height="50px" src="img/productSingle/${pi.id}.jpg"></a>
                                        </td>
                                        <td>
                                            <a deleteLink="true" href="admin_productImage_delete?id=${pi.id}">
                                                <span class="glyphicon glyphicon-trash"></span>
                                            </a>
                                        </td>
                                    </tr>
                                </c:forEach>
                            </tbody>
                        </table>

                </div>
            </td>
            <td class="addPictureTableTD">
                <div>
                    <div class="panel panel-warning addPictureDiv">
                        <div class="panel-heading">新增产品<b class="text-primary"> 详情 </b>图片</div>
                        <div class="panel-body">
                            <form method="post" class="addFormDetail" action="admin_productImage_add" enctype="multipart/form-data">
                                <table class="addTable">
                                    <tr>
                                        <td>请选择本地图片 790宽度为佳</td>
                                    </tr>
                                    <tr>
                                        <td align="center"><input id="filePathDetail" type="file" name="image"></td>
                                    </tr>
                                    <tr class="submitTR">
                                        <td align="center">
                                            <input type="hidden" name="type" value="type_detail" />
                                            <input type="hidden" name="pid" value="${product.id}" />
                                            <button type="submit" class="btn btn-success">提交</button>
                                        </td>
                                    </tr>
                                </table>
                            </form>
                        </div>
                    </div>
                        <!-- 详情图片数据展示 -->
                        <table class="table table-striped table-bordered table-hover table-condensed">
                            <thead>
                            <tr class="success">
                                <th>产品ID</th>
                                <th>产品详情图片缩略图</th>
                                <th>删除</th>
                            </tr>
                            </thead>
                            <tbody>
                            <c:forEach items="${pisDetail}" var="pi">
                                <tr>
                                    <td>${pi.id}</td>
                                    <td>
                                        <a title="点击查看原图" href="img/productDetail/${pi.id}.jpg">
                                            <img height="50px" src="img/productDetail/${pi.id}.jpg"></a>
                                    </td>
                                    <td>
                                        <a deleteLink="true" href="admin_productImage_delete?id=${pi.id}">
                                            <span class="glyphicon glyphicon-trash"></span>
                                        </a>
                                    </td>
                                </tr>
                            </c:forEach>
                            </tbody>
                        </table>
                </div>
            </td>
        </tr>
    </table>
</div>

